<!-- 显示当前访问的用户的信息 -->
<!-- 备注：与home页面重复 -->
{% extends '_base.html' %}
{% from 'data/#chart1.html' import chart1 %}
{% from 'data/#chart2.html' import chart2 %}
{% block active_social %} btn-primary {% endblock %}


{% block head %}
{{ super() }}
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
{% endblock head %}


{% block content %}
<div class="row">
    <div class="col-2 c-col-2-5"> 
        <!-- 重构：使用扩展没啥必要，自己放张图片效果也是一样的。 --> 
        {% if user.avatar %} 
            <img src="{{ url_for('getfile', filename=user.avatar) }}" class="img-fluid rounded-circle" alt="头像" style="height: 175px; width: 175px;"> 
        {% else %} 
            <img src="{{ avatars.default() }}" class="img-fluid rounded-circle" alt="头像" style="height: 175px; width: 175px;"> 
        {% endif %} 
    </div>  
    <div class="col"> 
        {% if user %} 
            <h2>{{ user.name }} <small class="text-success">LV{{ level }}</small></h2>
            <h3>{{ user.exp }} 
                <small><small>总经验
                    <small> (下一级还需：{{ need_exp }})</small>
                </small></small>
            </h3>
        {% else %}
            <p>未登录</p>
        {% endif %} 
        <p>个人简介：{{ user.introduce }}</p>
        <p>
            邮箱：{{ user.email }}
            <a class="btn btn-success btn-right" href="#" role="button">关注</a>
        </p>
    </div>
</div>
<hr>

<!-- 代码从home.html无脑粘贴 -->
<div class="row" style="height:50;"></div>
<div class="row">
    <div class="col-8">
        <style>
            .chart {
                width: 100%;
                height: 65vh;
            }
            @media screen and (max-width: 1000px) {
                .chart {
                    width: 95vw;
                    height: 34vh;
                }
            }
        </style>
        <div id="chart2" class="chart container-fluid pl-6 pr-0"></div>
        {% from 'data/#chart2.html' import chart2 %}
        {{ chart2(uid=user.id) }}

        <div id="chart1" class="chart container-fluid pl-0"></div>
        {% from 'data/#chart1.html' import chart1 %}
        {{ chart1(uid=user.id) }}
    </div>
</div>
{% endblock %}
